<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>进退货查询</title>
	<link rel="stylesheet" href="../../lib/layui-v2.6.3/css/layui.css" />
</head>
<body>
<div>
	<div class="layui-col-md12" style="background-color: #F6F6F6;" >
		<h2 style="margin: 20px; text-align: center;">进退货查询</h2>
	</div>
	<div class="layui-bg-gray" style="padding: 20px; background-color: #F6F6F6;">
		<div class="layui-row layui-col-space15" >
			<div class="layui-col-md12";>
				<div class="layui-panel" style="padding: 15px;">
					<label style="margin: 20px;">查询日期:</label>
					<!--<div class="layui-inline" id="test6">-->
						<!--<div>-->
							<!--<input type="text" autocomplete="off" id="test-startDate-1" class="layui-input" placeholder="开始日期">-->
						<!--</div>-->
					<!--</div>-->
					<div class="layui-inline">
						<div class="layui-input-inline">
							<input type="text" class="layui-input" id="test-startDate-1" placeholder="yyyy-MM-dd">
						</div>
					</div>
					<label style="padding: 20px;">至</label>
					<!--<div class="layui-inline" id="test7">-->
						<!--<input type="text" autocomplete="off" id="test-endDate-1" class="layui-input" placeholder="结束日期">-->
					<!--</div>-->
					<div class="layui-inline">
						<div class="layui-input-inline">
							<input type="text" class="layui-input" id="test-endDate-1" placeholder="yyyy-MM-dd">
						</div>
					</div>
					<div class="layui-inline" style="margin: 0px 40px 0px 10px;">
						<button class="layui-btn layui-btn-primary" id="demo1">
							<i class="layui-icon layui-icon-down layui-font-12"></i>
						</button>
					</div>
					<label>按供货商/单据号查询:</label>
					<div class="layui-inline">
						<input type="text" class="layui-input" id="danhao"/>
					</div>
					<button type="button" class="layui-btn layui-btn-radius" id="chaxun">查询</button>
				</div>
			</div>
		</div>
	</div>
	<div>
		<table class="layui-hide" id="inAndOutPro" lay-filter="inAndOutPro"></table>
	</div>
	<div>
		<div>商品的详细信息: </div>
	</div>
	<div>
		<table class="layui-hide" id="test2"></table>
	</div>
</div>
<script src="../../layui/layui.js"></script>
<script>
	//根据日期查询
    layui.use('laydate', function() {
        var laydate = layui.laydate;
        //日期范围
        //查询开始时间
        laydate.render({
            elem: '#test-startDate-1',
			value:getDay(0)
        });
        //查询结束时间
        laydate.render({
            elem: '#test-endDate-1',
            value:getDay(0)
        });
    });
	//进退货查询表table
    layui.use(['table','jquery'], function(){
        var table = layui.table;
        		$ = layui.jquery;
        //温馨提示：默认由前端自动合计当前行数据。从 layui 2.5.6 开始： 若接口直接返回了合计行数据，则优先读取接口合计行数据。
        //详见：https://www.layui.com/doc/modules/table.html#totalRow
        table.render({
            elem: '#inAndOutPro'
            ,url:'../../../searchPurchaseStock'/*tpa=https://www.layui.site/test/table/demo1.json*/
            ,title: '进货查询数据表'
            ,totalRow: true
            ,cols: [[
                {type: 'checkbox', fixed: 'left'}
                ,{field:'purStoId', width:120, title:'单号', totalRowText: '合计'}
                ,{field:'purStoDate', title:'开单日期', width:150 ,templet:"<div>{{layui.util.toDateString(d.purStoDate, 'yyyy-MM-dd')}}</div>"
                }
                ,{field:'supName', title:'供货商名称', width:120,templet:function (obj) {
                        return obj.supplierInfo.supName
                    }}
                ,{field:'depotName', title:'仓库名称', width:140,templet:function (obj) {
                        return obj.depotInfo.depotName
                    }}
                ,{field:'purStoPayable', title:'应付金额',width:120,totalRow: true, sort: true}
                ,{field:'purStoOutof', title:'实付金额', width:120,totalRow: true, sort: true}
                ,{field:'purStoOriginalNum', title:'原始单号', width:120}
                ,{field:'empName', title:'经办人', width:120,templet:function (obj) {
                        return obj.employeeInfo.empName
                    }}
                ,{field:'empName', title:'操作员', width:120,templet:function (obj) {
                        return obj.employeeInfo.empName
                    }}
                ,{field:'purStoCommment', title:'备注', width:140}
            ]]
            ,page: true
            ,limits:[10,15,20],
            limit:10
        });
		//调用inAndOutPro表格purStoId数据查询显示到test2
        table.on('row(inAndOutPro)',function (obj) {
            var data = obj.data;
            table.reload('test2',{
                where:{
                    purStoId:data.purStoId
                }
            })
        });

        $
        // 监听搜索操作，根据单号,时间查询数据
        $('#chaxun').click(function () {
            console.log($('#danhao').val());
            table.reload('inAndOutPro',{
                where:{
                    orcustNameAndId:$('#danhao').val(),
                    currentTimeStart:$('#test-startDate-1').val(),
                    currentTimeEnd:$('#test-endDate-1').val()
                }
            })
        })
    });
    //下拉选择限定时间查询
    //这个是用于处理月份没有两位数时，在前面加一个“0”
    function doHandleMonth(month){
        var m = month
        if(month.toString().length == 1){
            m = "0" + month;
        }
        return m;
    }
    function getDay(day){
        var today = new Date();
        var targetday_milliseconds=today.getTime() + 1000*60*60*24*day;
        today.setTime(targetday_milliseconds); //注意，这行是关键代码
        var tYear = today.getFullYear();
        var tMonth = today.getMonth();
        var tDate = today.getDate();
        tMonth = doHandleMonth(tMonth + 1);
        tDate = doHandleMonth(tDate);

        return tYear+"-"+tMonth+"-"+tDate;
    }
    // console.log("今天：" + getDay(0))
    // console.log("昨天：" + getDay(-1))
    // console.log("前天：" + getDay(-2))
    // console.log("最近七天：" + getDay(-6))
    // console.log("最近一月：" + getDay(0))//上个月的一号到现在
    // console.log("本月：" + getDay(-6))//这个月的一号到现在
    // console.log("上月：" + getDay(-6))//上个月的一号到上个月末
    // console.log("所有时间：" + getDay(-6))//起始时间到上个月末（这里起始时间为2009-07-03）

    var nowDate = new Date();
    var cloneNowDate = new Date();
    var fullYear = nowDate.getFullYear();
    var month = nowDate.getMonth() + 1; // getMonth 方法返回 0-11，代表1-12月
    var lastMonth = nowDate.getMonth(); //上个月
    var endOfMonth = new Date(fullYear, month, 0).getDate(); // 获取本月最后一天
    var endOfLastMonth = new Date(fullYear, lastMonth, 0).getDate(); // 获取本月最后一天

    function getFullDate(targetDate) {
        var D, y, m, d;
        if (targetDate) {
            D = new Date(targetDate);
            y = D.getFullYear();
            m = D.getMonth() + 1;
            d = D.getDate();
        } else {
            y = fullYear;
            m = month;
            d = date;
        }
        m = m > 9 ? m : '0' + m;
        d = d > 9 ? d : '0' + d;
        return y + '-' + m + '-' + d;
    };
    function getLastFullDate(targetDate) {
        var D, y, m, d;
        if (targetDate) {
            D = new Date(targetDate);
            y = D.getFullYear();
            m = D.getMonth();
            d = D.getDate();
        } else {
            y = fullYear;
            m = lastMonth;
            d = date;
        }
        m = m > 9 ? m : '0' + m;
        d = d > 9 ? d : '0' + d;
        return y + '-' + m + '-' + d;
    };
    var endDate = getFullDate(cloneNowDate.setDate(endOfMonth));//当月最后一天
    var starDate = getFullDate(cloneNowDate.setDate(1));//当月第一天
    var endLastDate = getLastFullDate(cloneNowDate.setDate(endOfLastMonth));//上月最后一天
    var starLastDate = getLastFullDate(cloneNowDate.setDate(1));//上月第一天
	//商品详细表table
    layui.use('table', function(){
        var table = layui.table;
        table.render({
            elem: '#test2'
            ,url: '/searchPurchaseStockDesc'
            ,totalRow: true
            ,cols: [[
                {field:'proId', title:'商品编号', width:150,totalRowText: '合计'}
                ,{field:'proName', title:'商品名称', width:150 }
                ,{field:'purStoDescUnit', title:'单位', width:120}
                ,{field:'proBid', title:'单价', width:140,templet:function (obj) {
                        return parseFloat(obj.productInfo.proBid);
                    }}
                ,{field:'purStoDescNum', title:'数量', width:120}
                ,{ title:'总金额',width:120,totalRowText: '<span></span>', sort: true,templet:function (d) {
                    console.log();
						return parseFloat(d.productInfo.proBid*d.purStoDescNum);
                    }}
                ,{field:'proSize', title:'产品规格', width:150, sort: true,templet:function (obj) {
                        return obj.productInfo.proSize
                    }}
                ,{field:'proBatchNum', title:'产品批号', width:150}
                ,{field: 'purchaseProValidityDate', title:'有效期至',width:150,templet:"<div>{{layui.util.toDateString(d.purStoDate, 'yyyy-MM-dd')}}</div>"}
            ]]
            ,page: true
        });
    });
    layui.use('layer', function() { //独立版的layer无需执行这一句
        var $ = layui.jquery,
            layer = layui.layer; //独立版的layer无需执行这一句

        $('#layerBtn1 .layui-btn').on('click', function() {
            var othis = $(this),
                method = othis.data('method');
            active[method] ? active[method].call(this, othis) : '';
        });
    });
	//根据点击时间状态进行查询
    layui.use('dropdown', function() {
        var dropdown = layui.dropdown
        dropdown.render({
            elem: '#demo1' //可绑定在任意元素中，此处以上述按钮为例
            ,
            data: [{
                title: '今天',
                id: 100,
			}, {
                title: '昨天',
                id: 101
            }, {
                title: '前天',
                id: 102
            }, {
                type: '-'
            }, {
                title: '最近七天',
                id: 103
            }, {
                title: '最近一月',
                id: 104
            }, {
                type: '-'
            }, {
                title: '本月',
                id: 105
            }, {
                title: '上月',
                id: 106
            }, {
                title: '所有时间',
                id: 107
            }],
            id: 'demo1'
            //菜单被点击的事件
            , click: function (obj) {
                layer.tips('点击了：' + obj.title, this.elem, { tips: [1, '#5FB878'] })
                switch (obj.id){
                    //今天
                    case 100:
                        $('#test-startDate-1').val(getDay(0));
                        $('#test-endDate-1').val(getDay(0));
                        break;
                    //昨天
                    case 101:
                        $('#test-startDate-1').val(getDay(-1));
                        $('#test-endDate-1').val(getDay(-1));
                        break;
                    //前天
                    case 102:
                        $('#test-startDate-1').val(getDay(-2));
                        $('#test-endDate-1').val(getDay(-2));
                        break;
                    //最近七天
                    case 103:
                        $('#test-startDate-1').val(getDay(-6));
                        $('#test-endDate-1').val(getDay(0));
                        break;
                    //最近一月
                    case 104:
                        $('#test-startDate-1').val(getDay(-30));
                        $('#test-endDate-1').val(getDay(0));
                        break;
                    //本月
                    case 105:
                        $('#test-startDate-1').val(starDate);
                        $('#test-endDate-1').val(getDay(0));
                        break;
                    //上月
                    case 106:
                        $('#test-startDate-1').val(starLastDate);
                        $('#test-endDate-1').val(endLastDate);
                        break;
                    //所有时间
                    case 107:
                        $('#test-startDate-1').val('2009-07-03');
                        $('#test-endDate-1').val(getDay(0));
                        break;
                }
            }
        });
    });
</script>
</body>
</html>
